import { Table, Pagination } from 'antd';
import React, { Component } from 'react'
import Stores from '../../stores'
import Actions from '../../actions'





//提交失败错误提示
const openNotificationWithIcon = (type,msg) => {
  notification[type]({
    message: '操作失败',
    description: msg,
  });
};
export default class CosmoTable extends Component {
    state = {
        current: 1,     //当前page
        size: 20,       //每页大大小
        total: 0,     //总条数
        resData: null,  //wmsAjax请求返回的数据
    }
    //和stroes进行通信挂钩 并绑定解绑事件unsubscribe
    unsubscribe = Stores.listen((resData)=>{
        //如果操作失败，则弹出提示
        if (resData.code == 'fail'){
            openNotificationWithIcon('error',resData.msg);
        } else if(resData.code == 'success') {
            this.setState({
                resData: resData,
                total: resData.data.totalCount
            })
        }

    })
    //组件销毁时解绑与Stores的监听
    componentWillUnmount(){
          this.unsubscribe();
    }
    //点击切换页面
    onPageChange = (page) => {
        let current = this.state.current;
        let size = this.state.size;

        let sendData = {
            rows: size,
            page: current
        }

        Actions.wmsAjax(this.props.changePageUrl,'post',sendData);
        this.setState({current: page});
    }
    //点击更改页面显示条数
    onShowSizeChange = (current,size) => {
        console.log('current:',current,'size:',size);

        let currentPage = this.state.current;
        let pageSize = this.state.size;
        let sendData = {
            rows: size,
            page: currentPage
        }
        Actions.wmsAjax(this.props.changePageUrl,'post',sendData);
        this.setState({size: size});
    }
    handleAction = () => {
        console.log('handleActionp');
    }
    //默认设置首次加载第一页（每页20条）数据
    componentDidMount(){
        let current = this.state.current;
        let size = this.state.size;
        let sendData = {
            rows: size,
            page: current
        }
        // Actions.wmsAjax(this.props.changePageUrl,'post',sendData);
    }
    render() {
        let dataSource = this.state.resData ? this.state.resData.data.records : [];
        return (
            <div>
                <Table pagination={false} columns={this.props.columns} dataSource={dataSource} rowKey='userId' scroll={{x: this.props.scrollX,y: 400}}/>
                <Pagination
                    style={{margin: '10px auto', width: '600px'}}
                    pageSize={this.state.size}
                    pageSizeOptions={['10', '20', '30', '40']}
                    showSizeChanger
                    showQuickJumper
                    total={this.state.total}
                    current={this.state.current}
                    onChange={this.onPageChange}
                    onShowSizeChange={this.onShowSizeChange}
                />
            </div>

        )
    }
}
